<template>
  <el-dialog
    title="新增商品规格"
    :visible.sync="isShow.sta"
    width="50%"
  >
    <el-form
      :model="form"
      style="text-align: left"
      label-width="100px"
    >
      <el-form-item label="属性名">
        <el-input v-model="form.specsname" style="width:80%"></el-input>
      </el-form-item>
      <el-form-item label="属性值">
        <div
          v-for="(i, index) in att_array"
          :key="index"
          style="margin-bottom: 5px"
        >
          <el-input
            v-model="att_array[index]"
            style="width:80%;margin-right:15px;"
          ></el-input>
          <el-button type="success" @click="add_attr" v-if="index === 0"
            >新增 </el-button
          ><el-button type="danger" @click="del_attr(index)" v-else>删除</el-button>
        </div>
      </el-form-item>
      <el-form-item label="属性状态">
        <el-radio-group v-model="form.status">
          <el-radio :label="1">正常</el-radio>
          <el-radio :label="0">禁用</el-radio>
        </el-radio-group>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button >取 消</el-button>
      <el-button type="primary" @click="sbmit">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
export default {
    data(){
      return{
         form:{
             id:0,
             specsname:'',
             status:1
         },
         att_array:[''],
         number:1
      }
    },
    methods:{
        addrules_xiugai(obj){
          console.log(obj);
          this.form.id = obj.id
          this.att_array=obj.attrs
          this.form.specsname=obj.specsname
          this.form.status = obj.status
        },
        chongqi(){
           this.form={
              id:0,
             specsname:'',
             status:1 
           },
           this.att_array=['']
        },
     add_attr(){
        this.att_array.push('')
     },
     del_attr(index){
         this.att_array.splice(index,1)
     },
     sbmit(){
         var addrules = {
             ...this.form,
             attrs:this.att_array.join(',')
         }
         console.log(addrules);
         let url = '/api/specsadd'
         if(this.form.id !=0){
             url='/api/specsedit'
         }
         
         this.$http.post(url,addrules).then(res=>{
               if(res.code==200){
                   this.chongqi()
                   this.isShow.sta=false
                   this.$emit('rulesadd')
               }
         })
     }
    },
    props:[
        'isShow'
    ]
};
</script>

<style>
</style>